/**
 * Created by mi on 2017/8/24.
 */
.design-works .works-list li {
  height: 300px; }
  .design-works .works-list li:hover {
    box-shadow: none; }
  .design-works .works-list li .info-title {
    color: #000; }
  .design-works .works-list li .img-loding:after {
    display: inline-block;
    position: absolute;
    width: 82px;
    height: 82px;
    top: 50%;
    left: 50%;
    margin-top: -41px;
    margin-left: -41px;
    background-image: url(../img/dlibrary/player.png);
    background-repeat: no-repeat;
    background-position: -96px -55px;
    cursor: pointer;
    z-index: 5;
    content: " ";
    opacity: 0;
    -webkit-transition: all .6s;
    transition: all .6s; }
  .design-works .works-list li .img-loding:hover:after {
    opacity: 1;
    -webkit-transition: all .6s;
    transition: all .6s; }

.design-works .works-list info-title {
  color: #000; }

.design-works .works-list li:nth-of-type(4n) {
  margin-right: 0; }

.video-wrapper {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  min-width: 1000px;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1000; }
  .video-wrapper .play-frame {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1000px;
    height: 700px;
    margin-top: -350px;
    margin-left: -500px;
    background-color: #fff; }
    .video-wrapper .play-frame .video-cover {
      position: absolute;
      width: 100%;
      height: 100%;
      background-color: #fff;
      z-index: 11; }
      .video-wrapper .play-frame .video-cover:before {
        position: absolute;
        width: 100%;
        height: 100%;
        display: inline-block;
        background-color: rgba(0, 0, 0, 0.2);
        z-index: 12;
        content: " "; }
      .video-wrapper .play-frame .video-cover img {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%); }
  .video-wrapper .btn-play, .video-wrapper .btnclosge {
    position: absolute;
    cursor: pointer; }
  .video-wrapper .btn-play {
    width: 164px;
    height: 164px;
    top: 50%;
    left: 50%;
    margin-top: -82px;
    margin-left: -82px;
    background-image: url(../img/dlibrary/player.png);
    background-repeat: no-repeat;
    background-position: -196px -110px;
    background-size: 2000px 2000px;
    z-index: 12; }
  .video-wrapper .btnclosge {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 36px;
    height: 36px;
    color: #fff;
    font-size: 36px;
    -ms-user-select: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none; }
